/**
 * Any CSS included here will be global. The classic template
 * bundles Infima by default. Infima is a CSS framework designed to
 * work well for content-centric websites.
 */

/* You can override the default Infima variables here. */
:root {
  --ifm-color-primary: #25c2a0;
  --ifm-color-primary-dark: rgb(33, 175, 144);
  --ifm-color-primary-darker: rgb(31, 165, 136);
  --ifm-color-primary-darkest: rgb(26, 136, 112);
  --ifm-color-primary-light: rgb(70, 203, 174);
  --ifm-color-primary-lighter: rgb(102, 212, 189);
  --ifm-color-primary-lightest: rgb(146, 224, 208);
  --ifm-code-font-size: 95%;

  --ifm-color-primary: #002aff;
  --ifm-color-primary-dark: #0026e6;
  --ifm-color-primary-darker: #0024d9;
  --ifm-color-primary-darkest: #001db3;
  --ifm-color-primary-light: #1a3fff;
  --ifm-color-primary-lighter: #264aff;
  --ifm-color-primary-lightest: #4d6aff;

  --ifm-border-color: #f4f2f4;
  --ifm-toc-border-color: var(--ifm-border-color);
  --ifm-background-color: white;
  --ifm-navbar-background-color: var(--ifm-background-color);

  --ifm-navbar-shadow: 0 0 0 1px var(--ifm-border-color);
  --ifm-container-width-xl: 1140px;

  /* background-color */

  /* --ifm-color-primary: #ff0059;
  --ifm-color-primary-dark: #e60050;
  --ifm-color-primary-darker: #d9004c;
  --ifm-color-primary-darkest: #b3003e;
  --ifm-color-primary-light: #ff1a6a;
  --ifm-color-primary-lighter: #ff2672;
  --ifm-color-primary-lightest: #ff4d8b;

  --ifm-color-primary: #6600ff;
  --ifm-color-primary-dark: #5c00e6;
  --ifm-color-primary-darker: #5700d9;
  --ifm-color-primary-darkest: #4700b3;
  --ifm-color-primary-light: #751aff;
  --ifm-color-primary-lighter: #7d26ff;
  --ifm-color-primary-lightest: #944dff; */
}

@font-face {
  font-family: 'Satoshi';
  src: url(/font/Satoshi-Medium.ttf);
}
@font-face {
  font-family: 'Satoshi';
  src: url(/font/Satoshi-Bold.ttf);
  font-weight: 600;
}
@font-face {
  font-family: 'Satoshi';
  src: url(/font/Satoshi-MediumItalic.ttf);
  font-style: italic;
}
@font-face {
  font-family: 'Satoshi';
  src: url(/font/Satoshi-Medium.ttf);
  font-weight: 500;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
li,
footer * {
  font-family: 'Satoshi', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
    Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif !important;
}

html {
  font-size: 17px;
}

p {
  font-size: 18px;
}

.menu {
  font-size: 17px;
  /* font-weight: bold; */
}

.docusaurus-highlight-code-line {
  background-color: rgba(0, 0, 0, 0.1);
  display: block;
  margin: 0 calc(-1 * var(--ifm-pre-padding));
  padding: 0 var(--ifm-pre-padding);
}

[data-theme='dark'] {
  --ifm-color-primary: #00ccff;
  --ifm-color-primary-dark: #00b8e6;
  --ifm-color-primary-darker: #00add9;
  --ifm-color-primary-darkest: #008fb3;
  --ifm-color-primary-light: #1ad1ff;
  --ifm-color-primary-lighter: #26d4ff;
  --ifm-color-primary-lightest: #4ddbff;

  --ifm-border-color: hsl(243 4.9% 18.8%);
  --ifm-toc-border-color: var(--ifm-border-color);
  --ifm-background-color: hsl(246 6% 9%);
}

html[data-theme='dark'] .docusaurus-highlight-code-line {
  background-color: rgba(0, 0, 0, 0.3);
}

[data-theme='light'] .shiki.min-dark {
  display: none;
}

[data-theme='dark'] .shiki.min-light {
  display: none;
}

.navbar--fixed-top {
  background-color: transparent;
  padding: 0;
}

.navbar__inner {
  backdrop-filter: blur(12px);
  background-color: transparent;
  padding: var(--ifm-navbar-padding-vertical)
    var(--ifm-navbar-padding-horizontal);
}

.menu__link,
.menu__list-item-collapsible {
  border-radius: 999px;
}

aside {
  border-right-width: 0px !important;
}

/* redesign... */

@import url('https://fonts.googleapis.com/css2?family=Geist+Mono:wght@400;500;600;700');

.navbar {
  transition-property: border-color, background-color, box-shadow;
  transition-duration: 0.2s;
  transition-timing-function: ease-in-out;
}

.theme-doc-sidebar-item-link {
  transition-property: all;
  transition-duration: 0.2s;
  transition-timing-function: ease-in-out;
}

html:not(.old) {
  transition-property: background-color;
  transition-duration: 0.2s;
  transition-timing-function: ease-in-out;

  code,
  pre {
    font-family: 'Geist Mono', monospace !important;
  }

  &[data-theme='dark'] {
    --ifm-background-color: #000 !important;
    --ifm-menu-color-background-active: #222;
  }

  &[data-theme='light'] {
    --ifm-background-color: #fff !important;
    --ifm-menu-color-background-active: #f1f1f1;
  }

  .menu__link,
  .menu__list-item-collapsible {
    border-radius: 12px;
  }

  .navbar--fixed-top {
    /* backdrop-filter: blur(12px); */
    background-color: var(--ifm-background-color);
    [data-theme='dark'] & {
      background-color: #0c0c0c;
      box-shadow: none;
    }
    overflow: visible;
  }
  .table-of-contents__left-border {
    box-shadow: none;
    border-width: 1px;
    border-style: solid;
    border-color: transparent;
    border-radius: 12px;

    [data-theme='dark'] & {
      background-color: #111;
    }

    [data-theme='light'] & {
      border-color: var(--ifm-border-color);
    }
  }
}
